<script setup>
  import { ref, onMounted } from 'vue'
  import { getNotifyListApi } from '@/apis/message'

  // 公告列表数据
  const announceList = ref([])
  // 下一页页码
  const nextPage = ref(1)
  // 每页包含数据条数
  const pageSize = ref(10)

  // 生命周期
  onMounted(() => {
    getAnnounceList()
  })

  // 任务列表
  const getAnnounceList = async (page = 1, pageSize = 10) => {
    const { code, data } = await getNotifyListApi(200, page, pageSize)
    // 检测接口是否调用成功
    if (code !== 200) return uni.utils.toast('获取通知失败，稍后重试!')
    // 渲染数据
    announceList.value = data.items || []
  }
</script>
<template>
  <scroll-view class="scroll-view" refresher-enabled scroll-y>
    <view class="scroll-view-wrapper">
      <view class="message-action">
        <text class="iconfont icon-clear"></text>
        全部已读
      </view>
      <uni-list :border="false">
        <uni-list-item
          v-for="announce in announceList"
          :key="announce.id"
          :to="`/subpkg_message/content/index?id=${announce.id}`"
          ellipsis="1"
          :title="announce.title"
          :right-text="announce.created"
        >
          <template v-slot:header>
            <text v-if="!announce.isRead" class="dot"></text>
          </template>
        </uni-list-item> </uni-list
    ></view>
  </scroll-view>
</template>

<style lang="scss" scoped>
  @import './styles.scss';
</style>
